<!DOCTYPE html>
<html>
<head>
<title>Presentation</title>
<meta charset='utf-8' />
<script src='slides.js'></script>
<link type="text/css" rel="stylesheet" href="css/scrollbar.css"/>
<link type="text/css" rel="stylesheet" href="css/curso.css"/>
</head>
<body style="display: none">
	
	<section class="slides layout-regular template-default">
      
		<!-- Your slides (<article>s) go here. Delete or comment out the slides below. -->
        
      	<article class="portada">
      		<header>
        		<h1>Curso de</h1>
        	</header>
        	<div class="logo-html">
        		<div>HTML</div>
				<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 512 512'>
					<path fill='#E34F26' d='M71,460 L30,0 481,0 440,460 255,512'/>
					<path fill='#EF652A' d='M256,472 L405,431 440,37 256,37'/>
					<path fill='#EBEBEB' d='M256,208 L181,208 176,150 256,150 256,94 114,94 129,265 256,265zM256,355 L192,338 188,293 132,293 139,382 256,414z'/>
					<path fill='#FFF' d='M255,208 L255,265 325,265 318,338 255,355 255,414 371,382 387,208zM255,94 L255,150 392,150 397,94z'/>
				</svg>
      		</div>
      		<div class="logo-css">
      			<div>CSS</div>
				<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 512 512'>
					<path fill='#E34F26' d='M71,460 L30,0 481,0 440,460 255,512'/>
					<path fill='#EF652A' d='M256,472 L405,431 440,37 256,37'/>
					<path fill='#EBEBEB' d='M129,265 L256,265 256,208 124,208zM119,150 L256,150 256,94 114,94zM256,355 L132,322 139,382 256,414z'/>
					<path fill='#FFF' d='M255,208 L255,265 325,265 318,338 255,355 255,414 371,382 397,94 255,94 255,150 336,150 330,208z'/>
				</svg>
      		</div>
      		<div class="logo-js">
      			<div>JS</div>
				<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' viewBox='0 0 512 512'>
					<path fill='#E34F26' d='M71,460 L30,0 481,0 440,460 255,512'/>
					<path fill='#EF652A' d='M256,472 L405,431 440,37 256,37'/>
					<path fill='#EBEBEB' d='M256,150 L256,94 255,94 114,94 118,150zM256,355 L192,338 188,293 132,293 139,382 256,414z'/>
					<path fill='#FFF' d='M336,150 L318,338 255,355 255,414 371,382 397,94 255,94 255,150z'/>
				</svg>
      		</div>
      		<footer>
      			Adri&aacute;n Seijo - Septiempre/Octubre 2011
      		</footer>
      	</article>

		<article>
        	<h2>&lt;html&gt;</h2>
      	</article>
		<article>
			<h3>El comienzo...</h3>
			<ul class="build">
				<li class="to-build">
					 Tim Berners-Lee public&oacute; el primer <a href="http://www.w3.org/History/19921103-hypertext/hypertext/WWW/MarkUp/Tags.html" target="_blank">documento p&uacute;blico</a> que habla de HTML en 1991, junto a la primera especificaciÃƒÂ³n de http.
				</li>
				<li class="to-build">
					 El nombre html significa "Hypertext Markup Language" y http es "Hypertext Transfer Protocol".
				</li>
				<li class="to-build">
					Su funci&oacute;n era compartir documentos a trav&eacute;s de la red.
				</li>
				<li class="to-build">
					Esta primera versi&oacute;n era muy simple, solo admit&iacute;a texto en diversas formas (listados, p&aacute;rrafos, cabeceras, etc) y enlaces, cuya funci&oacute;n principal era definir sem&aacute;nticamente el documento. Solo de podÃƒÂ­an hacer peticiones GET.
				</li>
				<li class="to-build">
					El acceso a los mismos se produc&iacute;a a trav&eacute;s de urls, lo que los hac&iacute;a f&aacute;ciles de compartir y adem&aacute;s los documentos de pod&iacute;an relacionar mediante enlaces. 
				</li>
			</ul>
		</article>
		<article>
			<h3>Ejemplo de html</h3>
			<iframe style="width: 100%; height: 500px" src="http://jsfiddle.net/kileras/ZfskT/embedded/"></iframe>
			<a href="http://jsfiddle.net/kileras/ZfskT/" target="_blank">http://jsfiddle.net/kileras/ZfskT/</a>
		</article>
		<article>
			<h3>El funcionamiento interno</h3>
			<p>
				Los documentos html se sirven mediante el protocolo http, donde un agente, normalemnte un navegador, realiza la petici&oacute;n de un documento que le es devuelto por un servidor.
			</p>
			<ul class="build">
				<li class="to-build">
					 El navegador solicita un documento haciendo una petici&oacute;n a una url: <a href="http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html" target="_blank">TheProject.html</a> (request).
				</li>
				<li class="to-build">
					 El servidor la "busca" y devuelve el documento html (response).
				</li>
				<li class="to-build">
					El navegador la devuelve y la muestra en pantalla, aplicando el formato que le corresponda segun los "tags" recibidos.
				</li>
				<li class="to-build">
					El protocolo http puede ser usado para devolver otros tipos de archivos ademas del html.
				</li>
			</ul>
		</article>
		<article>
			<p>Tanto la request como la response est&aacute;n divididas en dos partes, la cabecera y el cuerpo (header y body)</p>
			<ul class="build">
				<li class="to-build">La cabecera contiene los metadatos del documento (User-Agent, Host, Referer, Cookies, Post, etc).</li>
				<li class="to-build">El body contiene el propio documento</li>
				<li class="to-build">El documento html est&aacute; dividido de la misma manera</p>
			</ul>
		</article>
		<article>
			<h3>El comienzo de la guerra</h3>
			<p>
				En 1994 el navegador m&aacute;s extendido y el considerado mejor era Mosaic, pero unos de sus creadores crea su propia versi&oacute;n, Netscape, y en 1995 consigue hacerse con casi todo el mercado de los navegadores.
			</p>
			<p>
				En 1995 se publica un RFC con <a href="http://www.ietf.org/rfc/rfc1866.txt">HTML 2.0</a>, donde se implementan im&aacute;genes, tabla y formularios, y comienza a incrementarse su popularidad (un documento puede solicitar otros documentos).
			</p>
			<p>
				En ese momento Microsoft compra Mosaioc y desarrolla Internet Explorer 1.0, al poco tiempo saca la versi&oacute;n 2 y comienza la carrera por ser el mejor navegador
			</p>
		</article>
		<article>
			<p>
				Los dos principales navegadores comienzan a implementar funcionalidades que "extienden" HTML 2.0 cada uno a su manera.
			</p>
			<p>
				Como resultado tenemos cosas como los infames tags <blink>&lt;blink&gt;</blink> y <marquee>&lt;marquee&gt;</marquee>
			</p>
			<p>
				Netspace crea Javascript y Microsoft desarrolla su propia versi&oacute;n JScript.
			</p>
			<p>
				A principis de 1997 se presenta <a href="http://www.w3.org/TR/REC-html32">HTML 3.2</a>, la primera del W3C.
			</p>
			<p>
				En el mismo a&ntilde;o se presenta la especificaci&oacute; CSS 1, que permite cambiar fuentes, alineaciones, m&aacute;rgenes, etc.
			</p>
		</article>
		<article>
			<p>
				A finales de ese a&ntilde;o se presenta <a href="http://www.w3.org/TR/REC-html40-971218/">html 4.0</a>, que define modos de uso (doctypes) 
			</p>
			<ul class="build">
				<li class="to-build">
					Estricto - Donde los elementos obsoletos no est&aacute;n permitidos.
				</li>
				<li class="to-build">
					Transicional - Donde los elementos obsoletos est&aacute;n permitidos.
				</li>
				<li class="to-build">
					Frameset - Para aquellas p&aacute;ginas con frames.
				</li>
				<li class="to-build">
					<a href="http://en.wikipedia.org/wiki/Document_Type_Declaration" target="_blank">Ejemplos</a>
				</li>
			</ul>
		</article>
		<article>
			<p>
				El problema es quee l soporte de css es bastante precario porque los navegadores se preocupan m&aacute;s de implementar nuevas funcionalides que a ellos les parecen impotantes y tienden a no arreglar los fallos. 
			</p>
			<p>
				Finalmente Microsoft integra Internet Explorer 4 en Widnows y comienza a ganar la guerra, que termina con Explorer dominando el 96% del mercado de navegadores en 2002.
			</p>
		</article>
		<article>
			<p>
				Para esa fecha la W3C ha presentado HTML 4.01, XHTML 1.0 y XHTML 1.1
			</p>
			<p>
				En esos documentos se define el uso de html como se har&aacute; durante los pr&oacute;ximos 8 a&ntilde;os sin sufrir cambios. (<a href="http://reference.sitepoint.com/html/elements" target="_blank">Sitepoint</a>)
			</p>
		</article>
		<article>
			<h3>La revancha</h3>
			<p>
				En 2002 Apple hace un fork de KHTML y KJS, nace webkit, y comienza a trabajar en un navegador propio despu&eacute;s de que microsoft no portase IE6 a Mac.
			</p>
			<p>
				En 2004 nace Firefox, fork de Netscape despu&eacute;s de liberar su c&oacute;digo.
			</p>
			<p>
				Se alia con Opera y forman la <a href="http://en.wikipedia.org/wiki/Web_Hypertext_Application_Technology_Working_Group" target="_blank">WHATWG</a>, que crea propuestas para llevar a la W3C.
			</p>
			<p>
				M&aacute;s tarde se unir&aacute;n Apple y Google, mientras que Microsoft declin&oacute; la invitaci&oacute;n.
			</p>
			<p>
				Cualquiera puede participar en sus listas de correo y hacer u opinar sobre propuestas
			</p>
		</article>
		<article>
			<p>
				En 2007 microsoft lanza Internet Explorer 7 para contrarrestar el empuje de Firefox.
			</p>
			<p>
				En 2007 nace Safari y Netscape deja de existir.
			</p>
			<p>
				En 2008 sale Firefox 3.5 y ance Chrome, derivado de webkit.
			</p>
			<p>
				En 2009 sale Internet Explorer 8
			</p>
		</article>
		<article>
			<p>
				En 2011 se presenta oficialmente HTML5, la primera evoluci&oactue;n dle standar desde hace muchos a&ntilde;os, impulsada en gran parte por la whatwg, aunque se llevaba hablando de ella desde <a href="http://www.alistapart.com/articles/previewofhtml5">2007</a>.
			</p>
			<p>
				Incorpora muchos <a href="http://dev.w3.org/html5/html4-differences/#new-elements">tags nuevos</a> y fucnionalidades y supone el fin de XHTML2, la evoluci&oacute;n en que estaba trabajando la W3C.
			</p>
			<p>
				No confundir HTML5 con CSS3 o las evoluciones de Javascript, o si.
			</p>
			<p>
				<a href="http://html5boilerplate.com/">Ejemplo boilerplate</a>
			</p>
		</article>	
		<article>
			<p>
				Actualmente el porcentaje de uso de explorer sigue bajando minetras que el de Firefox se mantiene y Chrome va ganando adeptos.
			</p>
			<p>
				El mercado movil supone un gran cambio y una gran aumento del uso de webkit. 
			</p>	
		</article>
    </section>

  </body>
</html>
